import React from "react"
import { Global } from "@emotion/react"
import tw,{theme, css } from "twin.macro"
import { stylesBase } from "../components"
/**
 * Global 组件，用来插入全局 css
 */
const Layout = ({ children }) => (
  <div>
    <Global styles={stylesBase} />
    {(() => {
      console.log("====================================")
      console.log(theme`backgroundColor.primary`)
      console.log(tw`bg-regal-blue`);
      {/* console.log(tw`colors.pink`); */}
      console.log(theme`colors.pink`)
      console.log("====================================")
    })()}

    {/* 文字显示正常 */}
    <div css={css({ color: theme`textColor.regal-blue` })}>2222222222</div>
    {children}
    <section>section 内容</section>
    <p>fdsfdfdsfjskdfjsdklj</p>
  </div>
)

export default Layout
